<template>
  <div class="input_big_box">
    <div class="title_box" v-if="title||rightText">
      <div class="title">{{ title }}</div>
      <div class="title-right">{{rightText}}</div>
    </div>
    <div class="inp_content_box">
      <div class="input">
        <input
          v-model="inpValue"
          :placeholder="placeholder || $t('page4.doc58')"
          :disabled="disabled"
        />
      </div>
      <div class="inp_right send_text">
        <span v-if="time == 0" @click="sendCode">
          {{sendText || $t('page4.doc161') }}</span>
        <van-count-down
          v-else
          ref="countDown"
          :time="time"
          format="ss"
          @finish="time = 0"
        >
        </van-count-down>
      </div>
    </div>
  </div>
</template>

<script>
import input_mixins from './input_mixins';

export default {
  mixins: [input_mixins],
  props: {
    isNoSpace: {
      type: Boolean,
      default: true,
    },
    sendText: {
      type: String,
    },
    accountType: {
      //账号类型(0-手机 / 1-邮箱)
      type: [Number, String],
      default: 0,
    },
    account: {
      //发送验证的账号
      required: true,
    },
    verifyType: {
      //1	注册 2	登录 3	设置/更新密码 4	验证账号 5	修改账号 6	找回密码
      type: [Number, String],
      required: true,
    },
    isNumber: {
      type: Boolean,
      default: true,
    },
    prefix: {
      type: [Number, String],
    },
  },
  data() {
    return {
      time: 0,
    };
  },
  methods: {
    sendCode() {
      let params = {
        accountType: this.accountType,
        // prefix: this.areaId,
        account: this.account,
        type: this.verifyType,
      };
      if (this.accountType == 0) {
        //区号不能为空
        if (!this.prefix) return this.$toast(this.$t('page4.doc159'));
        //手机号不能为空
        if (!this.account) return this.$toast(this.$t('page4.doc160'));

        params.prefix = this.prefix;
      }

      if (this.accountType == 1 && !this.account) {
        //请输入邮箱号
        return this.$toast(this.$t('page4.doc158'));
      }
      this.$post(this.URL.user.code_send, params).then((res) => {
        if (res.code == 0) {
          this.time = 60000;
          this.$toast(res.message);
        } else {
          this.$toast(res.message);
        }
      });
    },
  },
};
</script>

<style lang="less" scoped>
@import './index';

.send_text {
  color: var(--themeColor);
  text-align: right;
  font-size: 0.28rem;

  /deep/ .van-count-down {
    color: var(--themeColor);
  }
}
</style>
